import { BasicColumn, FormSchema } from '/@/components/Table';
import { Tag } from "ant-design-vue";
import { h } from "vue";
import { getAllList } from '/@/api/privilege/account';


// 表格定义
export const columns: BasicColumn[] = [
  {
    title: '编号',
    dataIndex: 'formNo',
  },

  {
    title: '离职员工',
    dataIndex: 'leaveStaffId',
    customRender: ({ record }) => {
      if (record.work) {
        const color = 'green';
        const text = record.work.operatorName;
        return h(Tag, { color: color }, () => text)
      }
      return '';
    },
  },
  {
    title: '离职时间',
    dataIndex: 'leaveTime',
  },
  {
    title: '工作交接事项',
    dataIndex: 'workRemark',
  },
  {
    title: '财务交接事项',
    dataIndex: 'financialRemark',
  },

];

/**
 * 搜索字段定义
*/
export const searchFormSchema: FormSchema[] = [
  {
    field: 'keyword',
    label: '关键字',
    component: 'Input',
    componentProps: {
      placeholder: '请输入名称/标识',
    },
    labelWidth: 60,
    colProps: { span: 6, lg: { span: 6, offset: 0 }, sm: { span: 10, offset: 0 }, xs: { span: 16, offset: 0 } },
  },
];

/**
 * 表单字段定义
*/
export const formSchema: FormSchema[] = [
  {
    field: 'id',
    label: 'ID',
    component: 'Input',
    show: false,
  },
  {
    field: 'formNo',
    label: '表单编号',
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },
  {
    field: 'leaveStaffId',
    label: '离职员工',
    required: true,
    component: 'ApiSelect',
    componentProps: {
      api: getAllList,
      showSearch: true, 
      optionFilterProp: 'label',
      params: {},
      labelField: 'realName',
      valueField: 'id',
    }
  },
  {
    field: 'leaveTime',
    label: '离职日期',
    required: true,
    component: 'DatePicker',
  },
  {
    field: 'acceptStaffId',
    label: '交接员工',
    required: true,
    component: 'ApiSelect',
    componentProps: {
      api: getAllList,
      showSearch: true, 
      optionFilterProp: 'label',
      params: {},
      labelField: 'realName',
      valueField: 'id',
    }
  },
  {
    field: 'workRemark',
    label: '工作交接事项',
    component: 'InputTextArea',
    colProps: { span: 24 },
  },
  {
    field: 'financialRemark',
    label: '财务交接事项',
    component: 'InputTextArea',
    colProps: { span: 24 },
  },

];


